<template>
    <div>
        <Ainput v-model="inputValue"></Ainput>
         <h1>{{inputValue}}</h1>
        <h1>{{appName}}</h1>
        <h1>username :  {{username}}</h1>
        <h1>{{appversion}}</h1>
        <h1>{{firstLetter}}</h1>

    </div>
</template>



<script>
    import Ainput from "../components/Ainput";
    import {createNamespacedHelpers} from 'vuex'
    import {mapState,mapGetters} from 'vuex'
    import {mapState,mapGetters} from 'vuex'
    // const {mapState} = createNamespacedHelpers('user')

	export default {
		name: "store",
		props:[],
		components:{
            Ainput
		},
		data (){
			return {
                inputValue:''
			}
		},
		//方法
		methods:{

		},
		//计算方法
		computed:{
			...mapState({
                appName:state=>state.appName,
                username: state=>state.user.username
			}),
            ...mapGetters('user',[
            	'appversion',
                'firstLetter'
            ]),
			...mapGetters( [
				'appversion',

			]),
            // appversion(){
			// 	return this.$store.getters.appversion
            // }

            // appName(){
            // 	return this.$store.state.appName
            // },
            // username(){
            //
	        //     return this.$store.state.user.username
            // }
		},
		//watch数据监听
		watch: {

		},
		//数据过滤
		filters:{

		},
		//生命周期系列
		beforeCreate:function(){

		},
		created:function(){

		},
		beforeMount:function(){

		},
		mounted:function(){

		},
		beforeDestroy:function(){

		},
		destroyed:function(){

		},
		beforeUpdate:function(){

		},
		updated:function(){

		},
		beforeRouteEnter (to, from, next) {
			next(vm => {})
			// 注意，在路由进入之前，组件实例还未渲染，所以无法获取this实例，只能通过vm来访问组件实例
		},
		beforeRouteUpdate (to, from, next) {
			// 同一页面，刷新不同数据时调用，
			next()
		},

		beforeRouteLeave (to, from, next) {
			// 离开当前路由页面时调用
			next()
		}

	}
</script>





<style scoped>

</style>
